@charset "UTF-8";
@import "../common/scss/mixins";
@import "../common/scss/sprites";

.m-mask{
    background-color: rgba(0, 0, 0, 0);
	transition:  all 1s;
}
.dialog-wrap-info{
   background-color:rgba(146,146,146,.7);
   z-index:1000;
   width:60%;
   border-radius:0.4rem;
   .dialog-content-info{
      display:table;
      width:100%;
      height:100%;      
      .dialog-content-bd{
         display:table-cell;
         padding:3rem 2rem;
          text-align:center;
         color:$color10;
         font-size:$fs15;
      }
   }
}

.m-alert-dialog,.m-confirm-dialog {
  width: 25rem;
  background-color: $bg00;
  border-radius:0.4rem;
  text-align: center;
  margin: 0 auto;
  .tip {
    border-bottom: 1.5px solid $border01;
    .tip-head{
      @extend .flex-row;
      background-color: #f5f5f5;
      height:3.4rem;
      line-height: 3.4rem;
    }
    .tip-title {
      @extend .flex-item;
      font-size:$fs15;
      color: $color02;
      text-align: center;
    }
    .tip-close{
      padding: 0 1rem 0 2rem;
      font-size:1.5rem;
      color:#21ab38;
      position: absolute;
      right: 0;
    }
    div.content {
      padding: 1.5rem 1.5rem 4rem;
      font-size: 1.2rem;
      line-height:1.8rem;
    }
  }
  .alert {
    padding: 1.2rem 0;
    color: $color02;
    font-size: $fs15;
  }
  .operate{
    @extend .flex-row;
    height:2.8rem;
    span{
      display: block;
      @extend .flex-item;
      align-self: center;
      line-height: 2.8rem;
      &:last-child{
        color:#21ab38;
      }
    }
  }
}
.m-confirm-dialog{
  left: 50% !important;
  top: 50% !important;
  width: 80%;
  margin-left: -40%;
  margin-top: -40%;
}
.m-dialog{
  background-color: $bg00;
  width:100%;
  .icon-close{
	@include mix-close();
  }
  .dialog-head{
    font-size:$fs15;
    color:$color03;
    margin-bottom:0.5rem;
    height:4.8rem;
    line-height: 2.4rem;
    position:relative;
    border-bottom: 1.5px solid $border01;
    @extend .flex-row;
    .title,.close-wrap{
      display: block;

    }
    .title{
      @extend .flex-item;
      padding:1.4rem 0 0 1.4rem
    }
    .close-wrap{
      text-align: right;
      padding: 1.4rem 1.4rem 0 2.8rem;
    }
  }
  .dialog-inner {
    overflow: hidden;
  }
  .dialog-content{

  }
  .dialog-operate{
	  button{
		display: block;
		width: 100%;
		background-color:$bg04;
		height: 4.95rem;
		font-size:$fs18;
		color:$color10;
		border: 0;
		sub{font-size:$fs11;margin-right:0.4rem;}
		&.disabled{
		  background-color:$border02;
		}
	  }
  }
  .article{
    padding:1rem;
    color:$color02;
    font-size:1.1rem;
    h5{
      font-size:1.1rem;
      padding: 0.35rem 0;
    }
    p{
      line-height: 1.75rem;
      padding-bottom: 0.4rem;
    }
  }
}
@-webkit-keyframes slidein {
  from {
    transform: translate3d(0,100%, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}


.weui-mask{
	position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
	background: rgba(11,14,23,.7);
}
.weui-dialog {
    position: fixed;
    z-index: 5000;
    width: 85%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    background-color: #fdfdfe;
    text-align: center;
    @include radius();
    overflow: hidden;
	.weui-dialog-hd {
		padding: 2rem 1rem 0;
		.weui-dialog-title {
			font-size: $fs15;
			color:$color03;
		}
	}
	.weui-dialog-bd {
		text-align:center;
		padding: 1rem 1.4rem 2rem;
		font-size: $fs12;
		color: $color02;
		@include text_wrap;
		p{
			display: inline-block;
      text-align: justify;
		}
	}
	.weui-dialog-ft {
		position: relative;
		line-height: 4.3rem;
		border-top:1.5px solid $border01;
		@include flexbox;
		span{
		    position: relative;
			display: block;
			@include flex-grow(1);
			color: $color04;
			font-size: $fs15;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			&:first-child{
				border-right:1.5px solid $border01;
			}
		}
    .cancel {
      color: $color01;
    }
	}
}
